<template>
  <div>
    <TabCards :list="list" :title2="title2" :spanList="DogSpanList" />
  </div>
</template>
<script setup>
import TabCards from "../../components/Nbnc/TabCards.vue";
import { ref, watch } from "vue";
let title2 = ref([
  {
    name: "奶狗",
    stage: "one",
  },
  {
    name: "幼年狗",
    stage: "two",
  },
  {
    name: "成年狗",
    stage: "three",
  },
]);

let DogSpanList = ref(["奶狗", "幼年狗", "成年狗"]);

let list = ref([
  {
    name: "五谷类",
    img: "	https://cdn.moguvet.com/nbnc/2021/02/d760e290d29ead5b59f4b71eb0a833dd.png",
    food_category_id: 5,
    to: "",
  },
  {
    name: "饮品类",
    img: "https://cdn.moguvet.com/nbnc/2021/02/d036d5774fdf6538ba1f0a4160df6065.png",
    food_category_id: 2,
    to: "",
  },
  {
    name: "肉蛋类",
    img: "https://cdn.moguvet.com/nbnc/2021/02/f2859170c14fb50a040519f3dcd0471a.png",
    food_category_id: 3,
    to: "",
  },
  {
    name: "蔬菜类",
    img: "https://cdn.moguvet.com/nbnc/2021/02/79b4408105584337aa61ff218b4de4b4.png",
    food_category_id: 4,
    to: "",
  },
  {
    name: "水果类",
    img: "https://cdn.moguvet.com/nbnc/2021/02/907d73e8b51d3f0e38d1e67408eff043.png",
    food_category_id: 1,
    to: "",
  },
  {
    name: "豆奶类",
    img: "https://cdn.moguvet.com/nbnc/2021/02/8e2b1da59cf194a4d7bbd4563d6a24cc.png",
    food_category_id: 6,
    to: "",
  },
  {
    name: "水产类",
    img: "https://cdn.moguvet.com/nbnc/2021/02/472ddebe6f91373be0e8ea57b5d2c800.png",
    food_category_id: 7,
    to: "",
  },
  {
    name: "坚果类",
    img: "https://cdn.moguvet.com/nbnc/2021/02/472ddebe6f91373be0e8ea57b5d2c800.png",
    food_category_id: 8,
    to: "",
  },
  {
    name: "植物类",
    img: "https://cdn.moguvet.com/nbnc/2021/02/040542edab21e93fa9704d0b8c901ce0.png",
    food_category_id: 9,
    to: "",
  },
  {
    name: "调味品",
    img: "https://cdn.moguvet.com/nbnc/2021/02/1ce9b40c34d46555d0a6b2dceb38e1f7.png",
    food_category_id: 10,
    to: "",
  },
  {
    name: "零食类",
    img: "https://cdn.moguvet.com/nbnc/2021/02/196e76c4e694be290db475ccb52e562b.png",
    food_category_id: 11,
    to: "",
  },
  {
    name: "药食补品",
    img: "https://cdn.moguvet.com/nbnc/2021/03/7fc8d1cca64a9889db7a1861335331b4.png",
    food_category_id: 12,
    to: "",
  },
]);
</script>
<style scoped>
div {
  width: 100%;
}
</style>